﻿html, body
{
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    font-family:'Segoe UI', Arial, Verdana, 'Sans-Serif' !important;
    font-size: 12px !important;
    overflow: hidden;
}

.no-padding
{
    padding: 0px !important;
}

.no-margin
{
    margin: 0px !important;
}

.no-wrap
{
    white-space: nowrap;
}

.inline-content
{
    display: inline;
}

.inline-block-content
{
    display: inline-block;
}

.no-rounded-edge
{
    border-radius: 0px !important;
}

span.toolbar .m-btn-group a.m-btn
{
    margin-right: 4px;
}

canvas
{   
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}

.vertically-center
{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.fill
{
    min-height: 100%;
    height: 100%;  
}

.master-stroke .document-container
{    
}

.master-stroke .tooltip 
{
    position: fixed;    /* Fixes the z-ordering for tooltips */
}

.master-stroke .document-container .thumbnail-container, .master-stroke .document-container .canvas-container
{
    min-height: 100%;
    height: 100%;
    position: absolute;
}

.master-stroke .document-container .thumbnail-container
{
    width: 250px;    
    float: left;
    background-color: #B6BCC6;
    overflow-y: auto;
}

.master-stroke .document-container > .canvas-container
{        
    width: 100%;
    float: left;
    margin-left: 250px;
}

.master-stroke .document-container .thumbnail-container .thumbnail
{
    border-radius: 0px !important;
    width: 200px; 
    height: 150px;
    min-height: 150px;    
    background-color:white;
    margin: auto;
    margin-top: 15px;
    -moz-box-shadow: 0 0 1px 1px #AAA;
    -webkit-box-shadow: 0 0 1px 1px#AAA;
    box-shadow: 0 0 1px 1px #AAA;
    background-size: 100%;
    position: relative;    
}

.master-stroke .document-container .thumbnail-container .thumbnail .thumbnail-new-review,
.master-stroke .task-container .task-details .thumbnail .thumbnail-new-review
{
    position: absolute;
    right: 4px;
    top: -2px;    
}

.master-stroke .task-container .task-details .thumbnail
{
    background-color: white;
    position: relative;
}

.master-stroke .task-container .task-details .selected-thumbnail,
.master-stroke .document-container .thumbnail-container .selected-thumbnail
{
    border: 1px solid black;
}

.master-stroke .toolbar
{
    margin-top: 4px;    
}

/* Tab overrides */
.master-stroke .toolbar .nav
{
    margin-bottom: 2px;
}

.master-stroke .toolbar .tab-content
{
    border-bottom-color: rgb(221, 221, 221);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    margin-bottom: 2px;
    padding-left: 2px;    
    z-index: 2;
    overflow:visible;   /* Fixes menu issue where it was hidden behind the canvas */
}

.master-stroke .toolbar .tab-content ul.toolbar-group
{
    margin-left: 0px;
    margin-bottom: 2px;
}

.master-stroke .toolbar .tab-content ul.toolbar-group > li .m-btn
{
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 4px;
    min-width: 24px;
}

.master-stroke .toolbar .tab-content ul.toolbar-group > li .m-btn-group
{
    margin-top: 0px;
}

.master-stroke .toolbar .tab-content .toolbar-group > li
{
    display: inline-block;
    list-style-image: none;    
    list-style-type: none;
    vertical-align: top;    
    height: 100%;
    padding-right: 4px;
    border-right-width: 1px;
    border-color: #eee;
    border-right-style: solid;
    min-height: 90px;
    position: relative;
}

.master-stroke .toolbar .tab-content .toolbar-group > li > div
{    
    line-height: normal;
}

.master-stroke .toolbar .tab-content .toolbar-group > li > div.toolbar-group-title
{
    position: absolute;
    bottom: 0px;
    width: 100%;
    text-align: center;
    margin-top: 4px;
    color: #757575;
    z-index: -1;            /* Ensures any context menus hide the group title */
}

/* For open dropdowns, set background color and disable shadow */
.master-stroke .toolbar .tab-content .m-btn-group.open .m-btn.dropdown-toggle
{
    -webkit-box-shadow: none;
    background-color: rgb(193, 213, 242);
}

.master-stroke .toolbar .tab-content .m-btn
{
    background-image: none;
    background-color: white;
    padding-left: 8px;
    padding-right: 8px;
    margin-right: 2px;
}

.master-stroke .toolbar .tab-content .m-btn.active
{
    background-color: rgb(193, 213, 242);
    -webkit-box-shadow: none;
}

.master-stroke .toolbar .tab-content .m-btn:hover
{    
    background-color: rgb(193, 213, 242);
}

.master-stroke .toolbar .nav-tabs>li>a
{
    padding-top: 2px;
    padding-bottom: 2px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    -webkit-border-radius: 0px;
    border-bottom-width: 0px;
    text-transform: uppercase;
    color: black;
}

.master-stroke .toolbar .nav-tabs>li.active>a
{
    background-color: transparent !important;
    border-bottom-color: white;
    border-bottom-width: 1px;
    padding-bottom: 1px;
}

.master-stroke .toolbar .nav-tabs>li:not(.active)>a:hover
{
    background-color: transparent !important;
    border-color: white;
    cursor: default;
}

.master-stroke .toolbar .nav-tabs>li.active>a:hover,
.master-stroke .toolbar .nav-tabs>li.active>a:focus
{
    background-color: transparent !important;
    border-bottom-color: white;
    border-bottom-width: 1px;
}

.master-stroke .toolbar .m-btn-group div
{
    float: left;    
    margin-left: 16px;
    margin-right: 16px;
}

.master-stroke .toolbar div input[type="range"]
{
    width: 64px;
    margin-top: -20px;
    margin-right: 0px;
    margin-left: 4px;
}

.master-stroke .toolbar div input[type="color"]
{
    width: 44px;
    padding: 0;
    margin-top: -20px;    
    margin-left: 8px;
    line-height: 0px;
    margin-bottom: 0;
    height: 34px;
    border: 0;
}

[class^="icon-"]
{
    background-image: none !important; /* Bootstrap images clash with m-style images and font-awesome images */
}

.master-stroke .toolbar .tab-content input
{
    -webkit-box-shadow:none;
    border-radius: 0px !important;
}

.master-stroke #addTaskDialog textArea
{
    width: 80%;
}

.master-stroke .full-screen
{
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
    background-color: white;
    opacity: 1;    
}

.master-stroke .full-screen .back-btn
{
    margin-top: 0px;
}

.master-stroke .full-screen .title
{
    font-size: 32px;
    margin-left: 32px;
    margin-top: 16px;
    vertical-align: middle;
    line-height: 14px;
    display: inline-block;
    height: 100%;
    font-weight: lighter;
}

.master-stroke .float-left
{
    float: left;
}

.master-stroke .float-right
{
    float: right;
}

.master-stroke .span-width
{
    width: 100%;
}

.master-stroke .no-padding-left
{
    padding-left: 0px;
}

.master-stroke .thumbnail-container .task-selector
{
    position: fixed;
    max-width: 236px;
}

.master-stroke .thumbnail-container .task-selector .dropdown-carrettoggle .selector-text
{
    margin-left: 14px;
}

.master-stroke .thumbnail-container .task-selector .dropdown-carrettoggle .selector-icon
{
    margin-right: 0px;
}

.master-stroke .thumbnail-container .task-selector .m-dropdown-menu
{
    min-width: 248px;
}

.master-stroke .thumbnail-container .thumbnail-list
{
    margin-top: 48px;
}

.master-stroke .dropdown-menu li > a,
.master-stroke .m-dropdown-menu a
{
    cursor: default;
}

.master-stroke .thumbnail-container .task-selector .m-dropdown-menu a
{
    padding-left: 14px;
}

.master-stroke .toolbar .tab-content .toolbar-group .switch-button .switch-button-label
{
    text-align: center;
    font-size: xx-small !important;
}

.master-stroke .toolbar .tab-content .toolbar-group .switch-button
{
    display: inline-block;
    vertical-align: top;
    margin-top: 2px;
}

.master-stroke .has-switch,
.master-stroke .has-switch .switch-left,
.master-stroke .has-switch .switch-right
{
    border-radius: 0px;
}

.master-stroke .toolbar .tab-content .toolbar-group .reference-frames
{
    margin-top: 2px;
    display: inline-block;
    vertical-align: top;
    background-color: #E6E6E6;
    width: 400px;
    height: 72px;    
    white-space:nowrap;     /* This prevents flowing elements in next line */
    overflow: hidden;
}

.master-stroke .toolbar .tab-content .toolbar-group .reference-frames:hover
{
    overflow-x: auto;
}

.master-stroke .toolbar .tab-content .toolbar-group .reference-frames .reference-thumbnail-list .reference-thumbnail
{
    display: inline-block;
    vertical-align:text-top;
    background-color:white;
    margin-top: 4px;
    margin-left: 4px;
    border: 1px solid #999999;
}

.master-stroke .toolbar .tab-content .toolbar-group .reference-frames .reference-thumbnail-list .reference-thumbnail .dropdown-menu
{
    z-index: 20000;
}

.master-stroke .toolbar .tab-content .toolbar-group .disabled
{
    box-shadow: none;
    background-color: #eee;
}

.master-stroke .task-container
{
    position: relative;
}

.master-stroke .task-container .task-list
{
    width: 300px;
    position: absolute;
    bottom: 0px;
    background-color: #CB1200;
    display: inline-block;
    color: white;    
}

.master-stroke .task-container .task-details
{
    position: absolute;
    left: 300px;
    right: 0px;    
    display: inline-block;
    padding-left: 4px;    
}

.master-stroke .task-container .task-list h3
{
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-left: 12px;
}

.master-stroke .task-container .task-list .task-listitem
{
    margin-left: 4px;
    margin-right: 4px;
    border: 1px transparent solid;
}

.master-stroke .task-container .task-list .task-listitem.selected-task
{    
    border: 1px white solid;
}

.master-stroke .task-container .task-list .task-listitem h4
{
    margin-bottom: 0px;
    padding-bottom: 0px;
    cursor: default;
    padding-left: 12px;
}

.master-stroke .task-container .task-list .task-listitem h5
{
    margin: 0px;
    cursor: default;
    padding-left: 12px;
    padding-bottom: 0px;
}

.master-stroke .task-container .task-details .thumbnail
{
    display: inline-block;
    margin-bottom: 4px;
}

.master-stroke .modal
{
    z-index: 30000;
}

.master-stroke .modal-backdrop
{
    z-index:2500;
}

.master-stroke .context-menu
{
    z-index: 2000;
}
